<template>
  <div style="background-color: #f6f6f6;height: 100%" class="top">
    <Top style="margin-bottom: 20px"></Top>
    <el-backtop target=".top"></el-backtop>
    <router-view/>
    <Bottom></Bottom>
  </div>

</template>

<script>
import Top from "../components/Top";
import BackToTop from "../components/front/BackToTop";
import Bottom from "../components/Bottom";
export default {
  name: "Home",
  components: {
    Top,
    BackToTop,
    Bottom,
  },
}
</script>

<style scoped>
.el-main{
  padding: 0;
  height: 100vh;
}
.top{
  height: 100vh;
  overflow-x: hidden;
}
.scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
/*正常情况下滑块的样式*/
.scroll::-webkit-scrollbar-thumb {
  background-color: rgba(0,0,0,.05);
  border-radius: 10px;
  -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
}
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
.scroll:hover::-webkit-scrollbar-thumb {
  background-color: rgba(0,0,0,.2);
  border-radius: 10px;
  -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
}
/*鼠标悬浮在滑块上时滑块的样式*/
.scroll::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0,0,0,.4);
  -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1);
}
/*正常时候的主干部分*/
.scroll::-webkit-scrollbar-track {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
  background-color: white;
}
/*鼠标悬浮在滚动条上的主干部分*/
.scroll::-webkit-scrollbar-track:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.4);
  background-color: rgba(0,0,0,.01);
}
</style>
